/******************************************** 默认样式重置 ****************************************************/
* { /* 通配符 */
    box-sizing: border-box; /* 设置怪异盒模型，即padding和border包含在width里 */
    -moz-box-sizing: border-box;  /* Firefox浏览器需使用兼容写法 */
}

*:after, *:before {  /* 设置所有元素的:after和:before为怪异盒模型 */
    box-sizing: border-box;  /* 怪异盒模型 */
}

div {
    display: block; /* 转为块元素 */
}

html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, dl, dd, th, td, pre, form, input, select, textarea, button {
    margin: 0; /* 设置外边距 */
    padding: 0; /* 设置内边距 */
    line-height: 1.45; /* 设置行高，不带单位是倍数 */
    font-size: 14px; /* 设置字体大小 */
    /*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; !* 字体 *!*/
    font-family: '微软雅黑'; /* 设置某种字形 */
    color: #333; /* 设置字体颜色 */
}

ul {
    list-style: none; /* 去除li左边的默认样式 */
}

table {
    border-collapse: collapse; /* 合并表格的单元格 */
    border-spacing: 0; /* 合并单元格间空隙 */
    background-color: transparent; /* 表格背景颜色透明 */
}

img {
    border: none; /* 去除img的默认边框 */
    vertical-align: top /* 去除img的默认间隙 */
}

a {
    text-decoration: none; /* 去除a标签的默认下划线 */
}

textarea {
    resize: none; /* 禁止文本域(textarea)大小的拖动 */
    overflow: auto; /* 设置文本域(textarea)滚动条自适应 */
    outline: none; /* 去掉文本框获取焦点时的焦点框 */
}

.clear:before, .clear:after {
    display: table;
    content: " ";
}
.clear:after {
    clear: both;
}

.float-left {
    float: left !important;
}

.float-right {
    float: right !important;
}

.show {
    display: block !important;
}

.hidden {
    display: none !important;
}

.btn-group-vertical > .btn-group:after, .btn-group-vertical > .btn-group:before, .btn-toolbar:after, .btn-toolbar:before, .clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, /* .container:after, .container:before,  */.dl-horizontal dd:after, .dl-horizontal dd:before, .form-horizontal .form-group:after, .form-horizontal .form-group:before, .modal-footer:after, .modal-footer:before, .modal-header:after, .modal-header:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, .row:after, .row:before {
    display: table;
    content: " ";
}  /* 该样式应用于解决子级的margin值传递给父级 */

.btn-group-vertical > .btn-group:after, .btn-toolbar:after, .clearfix:after, .container-fluid:after, .container:after, .dl-horizontal dd:after, .form-horizontal .form-group:after, .modal-footer:after, .modal-header:after, .nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after, .pager:after, .panel-body:after, .row:after {
    clear: both;
}  /* 该样式应用于解决子级浮动引起的布局问题 */


@font-face {  /* CSS规则：定义自己的字体图标 */
    /* 字体图标样式 */
    font-family: 'Glyphicons Halflings';
    /* 字体图标路径 */
    src: url('../fonts/glyphicons-halflings-regular.eot');
    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
@font-face {
    font-family: 'fontello';
    src: url('../fonts/font/fontello.eot?22163208');
    src: url('../fonts/font/fontello.eot?22163208#iefix') format('embedded-opentype'),
    url('../fonts/font/fontello.woff?22163208') format('woff'),
    url('../fonts/font/fontello.ttf?22163208') format('truetype'),
    url('../fonts/font/fontello.svg?22163208#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

/****************安卓字体图标***************/
[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;

    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */

    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;

    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;

    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;

    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */

    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-android:before { content: '\f17b'; }
/******************************************/

.glyphicon {  /* 定义当前元素用于字体图标 */
    position: relative;
    top: 2px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* 以下是各种字体图标即对应的编码 */
.glyphicon-asterisk:before {
    content: "\002a";
}
.glyphicon-plus:before {
    content: "\002b";
}
.glyphicon-euro:before,
.glyphicon-eur:before {
    content: "\20ac";
}
.glyphicon-minus:before {
    content: "\2212";
}
.glyphicon-cloud:before {
    content: "\2601";
}
.glyphicon-envelope:before {
    content: "\2709";
}
.glyphicon-pencil:before {
    content: "\270f";
}
.glyphicon-glass:before {
    content: "\e001";
}
.glyphicon-music:before {
    content: "\e002";
}
.glyphicon-search:before {
    content: "\e003";
}
.glyphicon-heart:before {
    content: "\e005";
}
.glyphicon-star:before {
    content: "\e006";
}
.glyphicon-star-empty:before {
    content: "\e007";
}
.glyphicon-user:before {
    content: "\e008";
}
.glyphicon-film:before {
    content: "\e009";
}
.glyphicon-th-large:before {
    content: "\e010";
}
.glyphicon-th:before {
    content: "\e011";
}
.glyphicon-th-list:before {
    content: "\e012";
}
.glyphicon-ok:before {
    content: "\e013";
}
.glyphicon-remove:before {
    content: "\e014";
}
.glyphicon-zoom-in:before {
    content: "\e015";
}
.glyphicon-zoom-out:before {
    content: "\e016";
}
.glyphicon-off:before {
    content: "\e017";
}
.glyphicon-signal:before {
    content: "\e018";
}
.glyphicon-cog:before {
    content: "\e019";
}
.glyphicon-trash:before {
    content: "\e020";
}
.glyphicon-home:before {
    content: "\e021";
}
.glyphicon-file:before {
    content: "\e022";
}
.glyphicon-time:before {
    content: "\e023";
}
.glyphicon-road:before {
    content: "\e024";
}
.glyphicon-download-alt:before {
    content: "\e025";
}
.glyphicon-download:before {
    content: "\e026";
}
.glyphicon-upload:before {
    content: "\e027";
}
.glyphicon-inbox:before {
    content: "\e028";
}
.glyphicon-play-circle:before {
    content: "\e029";
}
.glyphicon-repeat:before {
    content: "\e030";
}
.glyphicon-refresh:before {
    content: "\e031";
}
.glyphicon-list-alt:before {
    content: "\e032";
}
.glyphicon-lock:before {
    content: "\e033";
}
.glyphicon-flag:before {
    content: "\e034";
}
.glyphicon-headphones:before {
    content: "\e035";
}
.glyphicon-volume-off:before {
    content: "\e036";
}
.glyphicon-volume-down:before {
    content: "\e037";
}
.glyphicon-volume-up:before {
    content: "\e038";
}
.glyphicon-qrcode:before {
    content: "\e039";
}
.glyphicon-barcode:before {
    content: "\e040";
}
.glyphicon-tag:before {
    content: "\e041";
}
.glyphicon-tags:before {
    content: "\e042";
}
.glyphicon-book:before {
    content: "\e043";
}
.glyphicon-bookmark:before {
    content: "\e044";
}
.glyphicon-print:before {
    content: "\e045";
}
.glyphicon-camera:before {
    content: "\e046";
}
.glyphicon-font:before {
    content: "\e047";
}
.glyphicon-bold:before {
    content: "\e048";
}
.glyphicon-italic:before {
    content: "\e049";
}
.glyphicon-text-height:before {
    content: "\e050";
}
.glyphicon-text-width:before {
    content: "\e051";
}
.glyphicon-align-left:before {
    content: "\e052";
}
.glyphicon-align-center:before {
    content: "\e053";
}
.glyphicon-align-right:before {
    content: "\e054";
}
.glyphicon-align-justify:before {
    content: "\e055";
}
.glyphicon-list:before {
    content: "\e056";
}
.glyphicon-indent-left:before {
    content: "\e057";
}
.glyphicon-indent-right:before {
    content: "\e058";
}
.glyphicon-facetime-video:before {
    content: "\e059";
}
.glyphicon-picture:before {
    content: "\e060";
}
.glyphicon-map-marker:before {
    content: "\e062";
}
.glyphicon-adjust:before {
    content: "\e063";
}
.glyphicon-tint:before {
    content: "\e064";
}
.glyphicon-edit:before {
    content: "\e065";
}
.glyphicon-share:before {
    content: "\e066";
}
.glyphicon-check:before {
    content: "\e067";
}
.glyphicon-move:before {
    content: "\e068";
}
.glyphicon-step-backward:before {
    content: "\e069";
}
.glyphicon-fast-backward:before {
    content: "\e070";
}
.glyphicon-backward:before {
    content: "\e071";
}
.glyphicon-play:before {
    content: "\e072";
}
.glyphicon-pause:before {
    content: "\e073";
}
.glyphicon-stop:before {
    content: "\e074";
}
.glyphicon-forward:before {
    content: "\e075";
}
.glyphicon-fast-forward:before {
    content: "\e076";
}
.glyphicon-step-forward:before {
    content: "\e077";
}
.glyphicon-eject:before {
    content: "\e078";
}
.glyphicon-chevron-left:before {
    content: "\e079";
}
.glyphicon-chevron-right:before {
    content: "\e080";
}
.glyphicon-plus-sign:before {
    content: "\e081";
}
.glyphicon-minus-sign:before {
    content: "\e082";
}
.glyphicon-remove-sign:before {
    content: "\e083";
}
.glyphicon-ok-sign:before {
    content: "\e084";
}
.glyphicon-question-sign:before {
    content: "\e085";
}
.glyphicon-info-sign:before {
    content: "\e086";
}
.glyphicon-screenshot:before {
    content: "\e087";
}
.glyphicon-remove-circle:before {
    content: "\e088";
}
.glyphicon-ok-circle:before {
    content: "\e089";
}
.glyphicon-ban-circle:before {
    content: "\e090";
}
.glyphicon-arrow-left:before {
    content: "\e091";
}
.glyphicon-arrow-right:before {
    content: "\e092";
}
.glyphicon-arrow-up:before {
    content: "\e093";
}
.glyphicon-arrow-down:before {
    content: "\e094";
}
.glyphicon-share-alt:before {
    content: "\e095";
}
.glyphicon-resize-full:before {
    content: "\e096";
}
.glyphicon-resize-small:before {
    content: "\e097";
}
.glyphicon-exclamation-sign:before {
    content: "\e101";
}
.glyphicon-gift:before {
    content: "\e102";
}
.glyphicon-leaf:before {
    content: "\e103";
}
.glyphicon-fire:before {
    content: "\e104";
}
.glyphicon-eye-open:before {
    content: "\e105";
}
.glyphicon-eye-close:before {
    content: "\e106";
}
.glyphicon-warning-sign:before {
    content: "\e107";
}
.glyphicon-plane:before {
    content: "\e108";
}
.glyphicon-calendar:before {
    content: "\e109";
}
.glyphicon-random:before {
    content: "\e110";
}
.glyphicon-comment:before {
    content: "\e111";
}
.glyphicon-magnet:before {
    content: "\e112";
}
.glyphicon-chevron-up:before {
    content: "\e113";
}
.glyphicon-chevron-down:before {
    content: "\e114";
}
.glyphicon-retweet:before {
    content: "\e115";
}
.glyphicon-shopping-cart:before {
    content: "\e116";
}
.glyphicon-folder-close:before {
    content: "\e117";
}
.glyphicon-folder-open:before {
    content: "\e118";
}
.glyphicon-resize-vertical:before {
    content: "\e119";
}
.glyphicon-resize-horizontal:before {
    content: "\e120";
}
.glyphicon-hdd:before {
    content: "\e121";
}
.glyphicon-bullhorn:before {
    content: "\e122";
}
.glyphicon-bell:before {
    content: "\e123";
}
.glyphicon-certificate:before {
    content: "\e124";
}
.glyphicon-thumbs-up:before {
    content: "\e125";
}
.glyphicon-thumbs-down:before {
    content: "\e126";
}
.glyphicon-hand-right:before {
    content: "\e127";
}
.glyphicon-hand-left:before {
    content: "\e128";
}
.glyphicon-hand-up:before {
    content: "\e129";
}
.glyphicon-hand-down:before {
    content: "\e130";
}
.glyphicon-circle-arrow-right:before {
    content: "\e131";
}
.glyphicon-circle-arrow-left:before {
    content: "\e132";
}
.glyphicon-circle-arrow-up:before {
    content: "\e133";
}
.glyphicon-circle-arrow-down:before {
    content: "\e134";
}
.glyphicon-globe:before {
    content: "\e135";
}
.glyphicon-wrench:before {
    content: "\e136";
}
.glyphicon-tasks:before {
    content: "\e137";
}
.glyphicon-filter:before {
    content: "\e138";
}
.glyphicon-briefcase:before {
    content: "\e139";
}
.glyphicon-fullscreen:before {
    content: "\e140";
}
.glyphicon-dashboard:before {
    content: "\e141";
}
.glyphicon-paperclip:before {
    content: "\e142";
}
.glyphicon-heart-empty:before {
    content: "\e143";
}
.glyphicon-link:before {
    content: "\e144";
}
.glyphicon-phone:before {
    content: "\e145";
}
.glyphicon-pushpin:before {
    content: "\e146";
}
.glyphicon-usd:before {
    content: "\e148";
}
.glyphicon-gbp:before {
    content: "\e149";
}
.glyphicon-sort:before {
    content: "\e150";
}
.glyphicon-sort-by-alphabet:before {
    content: "\e151";
}
.glyphicon-sort-by-alphabet-alt:before {
    content: "\e152";
}
.glyphicon-sort-by-order:before {
    content: "\e153";
}
.glyphicon-sort-by-order-alt:before {
    content: "\e154";
}
.glyphicon-sort-by-attributes:before {
    content: "\e155";
}
.glyphicon-sort-by-attributes-alt:before {
    content: "\e156";
}
.glyphicon-unchecked:before {
    content: "\e157";
}
.glyphicon-expand:before {
    content: "\e158";
}
.glyphicon-collapse-down:before {
    content: "\e159";
}
.glyphicon-collapse-up:before {
    content: "\e160";
}
.glyphicon-log-in:before {
    content: "\e161";
}
.glyphicon-flash:before {
    content: "\e162";
}
.glyphicon-log-out:before {
    content: "\e163";
}
.glyphicon-new-window:before {
    content: "\e164";
}
.glyphicon-record:before {
    content: "\e165";
}
.glyphicon-save:before {
    content: "\e166";
}
.glyphicon-open:before {
    content: "\e167";
}
.glyphicon-saved:before {
    content: "\e168";
}
.glyphicon-import:before {
    content: "\e169";
}
.glyphicon-export:before {
    content: "\e170";
}
.glyphicon-send:before {
    content: "\e171";
}
.glyphicon-floppy-disk:before {
    content: "\e172";
}
.glyphicon-floppy-saved:before {
    content: "\e173";
}
.glyphicon-floppy-remove:before {
    content: "\e174";
}
.glyphicon-floppy-save:before {
    content: "\e175";
}
.glyphicon-floppy-open:before {
    content: "\e176";
}
.glyphicon-credit-card:before {
    content: "\e177";
}
.glyphicon-transfer:before {
    content: "\e178";
}
.glyphicon-cutlery:before {
    content: "\e179";
}
.glyphicon-header:before {
    content: "\e180";
}
.glyphicon-compressed:before {
    content: "\e181";
}
.glyphicon-earphone:before {
    content: "\e182";
}
.glyphicon-phone-alt:before {
    content: "\e183";
}
.glyphicon-tower:before {
    content: "\e184";
}
.glyphicon-stats:before {
    content: "\e185";
}
.glyphicon-sd-video:before {
    content: "\e186";
}
.glyphicon-hd-video:before {
    content: "\e187";
}
.glyphicon-subtitles:before {
    content: "\e188";
}
.glyphicon-sound-stereo:before {
    content: "\e189";
}
.glyphicon-sound-dolby:before {
    content: "\e190";
}
.glyphicon-sound-5-1:before {
    content: "\e191";
}
.glyphicon-sound-6-1:before {
    content: "\e192";
}
.glyphicon-sound-7-1:before {
    content: "\e193";
}
.glyphicon-copyright-mark:before {
    content: "\e194";
}
.glyphicon-registration-mark:before {
    content: "\e195";
}
.glyphicon-cloud-download:before {
    content: "\e197";
}
.glyphicon-cloud-upload:before {
    content: "\e198";
}
.glyphicon-tree-conifer:before {
    content: "\e199";
}
.glyphicon-tree-deciduous:before {
    content: "\e200";
}
.glyphicon-cd:before {
    content: "\e201";
}
.glyphicon-save-file:before {
    content: "\e202";
}
.glyphicon-open-file:before {
    content: "\e203";
}
.glyphicon-level-up:before {
    content: "\e204";
}
.glyphicon-copy:before {
    content: "\e205";
}
.glyphicon-paste:before {
    content: "\e206";
}
.glyphicon-alert:before {
    content: "\e209";
}
.glyphicon-equalizer:before {
    content: "\e210";
}
.glyphicon-king:before {
    content: "\e211";
}
.glyphicon-queen:before {
    content: "\e212";
}
.glyphicon-pawn:before {
    content: "\e213";
}
.glyphicon-bishop:before {
    content: "\e214";
}
.glyphicon-knight:before {
    content: "\e215";
}
.glyphicon-baby-formula:before {
    content: "\e216";
}
.glyphicon-tent:before {
    content: "\26fa";
}
.glyphicon-blackboard:before {
    content: "\e218";
}
.glyphicon-bed:before {
    content: "\e219";
}
.glyphicon-apple:before {
    content: "\f8ff";
}
.glyphicon-erase:before {
    content: "\e221";
}
.glyphicon-hourglass:before {
    content: "\231b";
}
.glyphicon-lamp:before {
    content: "\e223";
}
.glyphicon-duplicate:before {
    content: "\e224";
}
.glyphicon-piggy-bank:before {
    content: "\e225";
}
.glyphicon-scissors:before {
    content: "\e226";
}
.glyphicon-bitcoin:before {
    content: "\e227";
}
.glyphicon-btc:before {
    content: "\e227";
}
.glyphicon-xbt:before {
    content: "\e227";
}
.glyphicon-yen:before {
    content: "\00a5";
}
.glyphicon-jpy:before {
    content: "\00a5";
}
.glyphicon-ruble:before {
    content: "\20bd";
}
.glyphicon-rub:before {
    content: "\20bd";
}
.glyphicon-scale:before {
    content: "\e230";
}
.glyphicon-ice-lolly:before {
    content: "\e231";
}
.glyphicon-ice-lolly-tasted:before {
    content: "\e232";
}
.glyphicon-education:before {
    content: "\e233";
}
.glyphicon-option-horizontal:before {
    content: "\e234";
}
.glyphicon-option-vertical:before {
    content: "\e235";
}
.glyphicon-menu-hamburger:before {
    content: "\e236";
}
.glyphicon-modal-window:before {
    content: "\e237";
}
.glyphicon-oil:before {
    content: "\e238";
}
.glyphicon-grain:before {
    content: "\e239";
}
.glyphicon-sunglasses:before {
    content: "\e240";
}
.glyphicon-text-size:before {
    content: "\e241";
}
.glyphicon-text-color:before {
    content: "\e242";
}
.glyphicon-text-background:before {
    content: "\e243";
}
.glyphicon-object-align-top:before {
    content: "\e244";
}
.glyphicon-object-align-bottom:before {
    content: "\e245";
}
.glyphicon-object-align-horizontal:before {
    content: "\e246";
}
.glyphicon-object-align-left:before {
    content: "\e247";
}
.glyphicon-object-align-vertical:before {
    content: "\e248";
}
.glyphicon-object-align-right:before {
    content: "\e249";
}
.glyphicon-triangle-right:before {
    content: "\e250";
}
.glyphicon-triangle-left:before {
    content: "\e251";
}
.glyphicon-triangle-bottom:before {
    content: "\e252";
}
.glyphicon-triangle-top:before {
    content: "\e253";
}
.glyphicon-console:before {
    content: "\e254";
}
.glyphicon-superscript:before {
    content: "\e255";
}
.glyphicon-subscript:before {
    content: "\e256";
}
.glyphicon-menu-left:before {
    content: "\e257";
}
.glyphicon-menu-right:before {
    content: "\e258";
}
.glyphicon-menu-down:before {
    content: "\e259";
}
.glyphicon-menu-up:before {
    content: "\e260";
}

.bs-glyphicons li {
    float: left;
    width: 25%;
    height: 115px;
    padding: 10px;
    font-size: 10px;
    line-height: 1.4;
    text-align: center;
    background-color: #f9f9f9;
    border: 1px solid #fff;
}
.bs-glyphicons li:hover,
.bs-glyphicons li:focus{
    background-color: #3c764f;
    color: #fff;
}

@media (min-width: 768px) {
    .bs-glyphicons li {
        width: 12.5%;
        font-size: 12px;
    }
}

.bs-glyphicons .glyphicon {
    margin-top: 5px;
    margin-bottom: 10px;
    font-size: 24px;
}

.bs-glyphicons .glyphicon-class {
    display: block;
    text-align: center;
    word-wrap: break-word;
}
/******************************************** container布局 ****************************************************/
@media (min-width: 768px) {  /* 媒体查询(屏幕宽度为768px以上时应用以下样式)，用于响应式 */
    .container {
        width: 750px; /* 设置宽度 */
    }
}

@media (min-width: 992px) {  /* 媒体查询(屏幕宽度为992px以上时应用以下样式)，用于响应式 */
    .container {
        width: 970px; /* 设置宽度 */
    }
}

@media (min-width: 1200px) {  /* 媒体查询(屏幕宽度为1200px以上时应用以下样式)，用于响应式 */
    .container {
        width: 1170px; /* 设置宽度 */
    }
}

.container {  /* 左右对称布局 */
    margin: 0 auto; /* 设置外边距 */
    padding: 0 15px;
    zoom: 1; /* 触发IE6、7的haslayout,使浏览器重新计算 */
}

.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.container:after, .container:before {
    display: table; /* 解决该样式所在的div的子级的margin值传递给父级 */
    content: ''; /* 解决该样式所在的div的子级的margin值传递给父级 */
}

.container:after {
    clear: both; /* 在该样式所在div的最后处清除浮动，防止该div里的内容因浮动而影响该div后面盒子的布局！ */
}

.contant {
    width: 100%;
    padding: 0 22px;
    margin: 0 auto;
}


/******************************************** 栅格系统 ****************************************************/
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;  /* 相对定位,作用于类col-*-push-*和类col-*-pull-* */
    min-height: 1px;
}

/* 栅格系统布局：将屏幕宽度划分为十二等份，根据屏幕大小自动选择相应的布局样式 */
@media (max-width: 768px) {
    /* col-xs-*：为超小屏幕(手机屏幕) */
    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
        float: left;
    }
    .col-xs-12 {
        width: 100%;
    }

    .col-xs-11 {
        width: 91.66666667%;
    }

    .col-xs-10 {
        width: 83.33333333%;
    }

    .col-xs-9 {
        width: 75%;
    }

    .col-xs-8 {
        width: 66.66666667%;
    }

    .col-xs-7 {
        width: 58.33333333%;
    }

    .col-xs-6 {
        width: 50%;
    }

    .col-xs-5 {
        width: 41.66666667%;
    }

    .col-xs-4 {
        width: 33.33333333%;
    }

    .col-xs-3 {
        width: 25%;
    }

    .col-xs-2 {
        width: 16.66666667%;
    }

    .col-xs-1 {
        width: 8.33333333%;
    }

    .col-xs-pull-12 {
        right: 100%;
    }

    .col-xs-pull-11 {
        right: 91.66666667%;
    }

    .col-xs-pull-10 {
        right: 83.33333333%;
    }

    .col-xs-pull-9 {
        right: 75%;
    }

    .col-xs-pull-8 {
        right: 66.66666667%;
    }

    .col-xs-pull-7 {
        right: 58.33333333%;
    }

    .col-xs-pull-6 {
        right: 50%;
    }

    .col-xs-pull-5 {
        right: 41.66666667%;
    }

    .col-xs-pull-4 {
        right: 33.33333333%;
    }

    .col-xs-pull-3 {
        right: 25%;
    }

    .col-xs-pull-2 {
        right: 16.66666667%;
    }

    .col-xs-pull-1 {
        right: 8.33333333%;
    }

    .col-xs-pull-0 {
        right: auto;
    }

    .col-xs-push-12 {
        left: 100%;
    }

    .col-xs-push-11 {
        left: 91.66666667%;
    }

    .col-xs-push-10 {
        left: 83.33333333%;
    }

    .col-xs-push-9 {
        left: 75%;
    }

    .col-xs-push-8 {
        left: 66.66666667%;
    }

    .col-xs-push-7 {
        left: 58.33333333%;
    }

    .col-xs-push-6 {
        left: 50%;
    }

    .col-xs-push-5 {
        left: 41.66666667%;
    }

    .col-xs-push-4 {
        left: 33.33333333%;
    }

    .col-xs-push-3 {
        left: 25%;
    }

    .col-xs-push-2 {
        left: 16.66666667%;
    }

    .col-xs-push-1 {
        left: 8.33333333%;
    }

    .col-xs-push-0 {
        left: auto;
    }

    .col-xs-offset-12 {
        margin-left: 100%;
    }

    .col-xs-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-xs-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-xs-offset-9 {
        margin-left: 75%;
    }

    .col-xs-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-xs-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-xs-offset-6 {
        margin-left: 50%;
    }

    .col-xs-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-xs-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-xs-offset-3 {
        margin-left: 25%;
    }

    .col-xs-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-xs-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-xs-offset-0 {
        margin-left: 0;
    }
}
@media (min-width: 768px) {
    /* col-sm-*：为小屏幕(平板) */
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
        float: left;
    }
    .col-sm-12 {
        width: 100%;
    }
    .col-sm-11 {
        width: 91.66666667%;
    }
    .col-sm-10 {
        width: 83.33333333%;
    }
    .col-sm-9 {
        width: 75%;
    }
    .col-sm-8 {
        width: 66.66666667%;
    }
    .col-sm-7 {
        width: 58.33333333%;
    }
    .col-sm-6 {
        width: 50%;
    }
    .col-sm-5 {
        width: 41.66666667%;
    }
    .col-sm-4 {
        width: 33.33333333%;
    }
    .col-sm-3 {
        width: 25%;
    }
    .col-sm-2 {
        width: 16.66666667%;
    }
    .col-sm-1 {
        width: 8.33333333%;
    }
    .col-sm-pull-12 {
        right: 100%;
    }
    .col-sm-pull-11 {
        right: 91.66666667%;
    }
    .col-sm-pull-10 {
        right: 83.33333333%;
    }
    .col-sm-pull-9 {
        right: 75%;
    }
    .col-sm-pull-8 {
        right: 66.66666667%;
    }
    .col-sm-pull-7 {
        right: 58.33333333%;
    }
    .col-sm-pull-6 {
        right: 50%;
    }
    .col-sm-pull-5 {
        right: 41.66666667%;
    }
    .col-sm-pull-4 {
        right: 33.33333333%;
    }
    .col-sm-pull-3 {
        right: 25%;
    }
    .col-sm-pull-2 {
        right: 16.66666667%;
    }
    .col-sm-pull-1 {
        right: 8.33333333%;
    }
    .col-sm-pull-0 {
        right: auto;
    }
    .col-sm-push-12 {
        left: 100%;
    }
    .col-sm-push-11 {
        left: 91.66666667%;
    }
    .col-sm-push-10 {
        left: 83.33333333%;
    }
    .col-sm-push-9 {
        left: 75%;
    }
    .col-sm-push-8 {
        left: 66.66666667%;
    }
    .col-sm-push-7 {
        left: 58.33333333%;
    }
    .col-sm-push-6 {
        left: 50%;
    }
    .col-sm-push-5 {
        left: 41.66666667%;
    }
    .col-sm-push-4 {
        left: 33.33333333%;
    }
    .col-sm-push-3 {
        left: 25%;
    }
    .col-sm-push-2 {
        left: 16.66666667%;
    }
    .col-sm-push-1 {
        left: 8.33333333%;
    }
    .col-sm-push-0 {
        left: auto;
    }
    .col-sm-offset-12 {
        margin-left: 100%;
    }
    .col-sm-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-sm-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-sm-offset-9 {
        margin-left: 75%;
    }
    .col-sm-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-sm-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-sm-offset-6 {
        margin-left: 50%;
    }
    .col-sm-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-sm-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-sm-offset-3 {
        margin-left: 25%;
    }
    .col-sm-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-sm-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-sm-offset-0 {
        margin-left: 0;
    }
}
@media (min-width: 992px) {
    /* col-md-*：为中等屏幕(笔记本) */
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
    }
    .col-md-12 {
        width: 100%;
    }
    .col-md-11 {
        width: 91.66666667%;
    }
    .col-md-10 {
        width: 83.33333333%;
    }
    .col-md-9 {
        width: 75%;
    }
    .col-md-8 {
        width: 66.66666667%;
    }
    .col-md-7 {
        width: 58.33333333%;
    }
    .col-md-6 {
        width: 50%;
    }
    .col-md-5 {
        width: 41.66666667%;
    }
    .col-md-4 {
        width: 33.33333333%;
    }
    .col-md-3 {
        width: 25%;
    }
    .col-md-2 {
        width: 16.66666667%;
    }
    .col-md-1 {
        width: 8.33333333%;
    }
    .col-md-pull-12 {
        right: 100%;
    }
    .col-md-pull-11 {
        right: 91.66666667%;
    }
    .col-md-pull-10 {
        right: 83.33333333%;
    }
    .col-md-pull-9 {
        right: 75%;
    }
    .col-md-pull-8 {
        right: 66.66666667%;
    }
    .col-md-pull-7 {
        right: 58.33333333%;
    }
    .col-md-pull-6 {
        right: 50%;
    }
    .col-md-pull-5 {
        right: 41.66666667%;
    }
    .col-md-pull-4 {
        right: 33.33333333%;
    }
    .col-md-pull-3 {
        right: 25%;
    }
    .col-md-pull-2 {
        right: 16.66666667%;
    }
    .col-md-pull-1 {
        right: 8.33333333%;
    }
    .col-md-pull-0 {
        right: auto;
    }
    .col-md-push-12 {
        left: 100%;
    }
    .col-md-push-11 {
        left: 91.66666667%;
    }
    .col-md-push-10 {
        left: 83.33333333%;
    }
    .col-md-push-9 {
        left: 75%;
    }
    .col-md-push-8 {
        left: 66.66666667%;
    }
    .col-md-push-7 {
        left: 58.33333333%;
    }
    .col-md-push-6 {
        left: 50%;
    }
    .col-md-push-5 {
        left: 41.66666667%;
    }
    .col-md-push-4 {
        left: 33.33333333%;
    }
    .col-md-push-3 {
        left: 25%;
    }
    .col-md-push-2 {
        left: 16.66666667%;
    }
    .col-md-push-1 {
        left: 8.33333333%;
    }
    .col-md-push-0 {
        left: auto;
    }
    .col-md-offset-12 {
        margin-left: 100%;
    }
    .col-md-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-md-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-md-offset-9 {
        margin-left: 75%;
    }
    .col-md-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-md-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-md-offset-6 {
        margin-left: 50%;
    }
    .col-md-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-md-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-md-offset-3 {
        margin-left: 25%;
    }
    .col-md-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-md-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-md-offset-0 {
        margin-left: 0;
    }
}
@media (min-width: 1200px) {
    /* col-md-*：为大屏幕(桌面显示器) */
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        float: left;
    }
    .col-lg-12 {
        width: 100%;
    }
    .col-lg-11 {
        width: 91.66666667%;
    }
    .col-lg-10 {
        width: 83.33333333%;
    }
    .col-lg-9 {
        width: 75%;
    }
    .col-lg-8 {
        width: 66.66666667%;
    }
    .col-lg-7 {
        width: 58.33333333%;
    }
    .col-lg-6 {
        width: 50%;
    }
    .col-lg-5 {
        width: 41.66666667%;
    }
    .col-lg-4 {
        width: 33.33333333%;
    }
    .col-lg-3 {
        width: 25%;
    }
    .col-lg-2 {
        width: 16.66666667%;
    }
    .col-lg-1 {
        width: 8.33333333%;
    }
    .col-lg-pull-12 {
        right: 100%;
    }
    .col-lg-pull-11 {
        right: 91.66666667%;
    }
    .col-lg-pull-10 {
        right: 83.33333333%;
    }
    .col-lg-pull-9 {
        right: 75%;
    }
    .col-lg-pull-8 {
        right: 66.66666667%;
    }
    .col-lg-pull-7 {
        right: 58.33333333%;
    }
    .col-lg-pull-6 {
        right: 50%;
    }
    .col-lg-pull-5 {
        right: 41.66666667%;
    }
    .col-lg-pull-4 {
        right: 33.33333333%;
    }
    .col-lg-pull-3 {
        right: 25%;
    }
    .col-lg-pull-2 {
        right: 16.66666667%;
    }
    .col-lg-pull-1 {
        right: 8.33333333%;
    }
    .col-lg-pull-0 {
        right: auto;
    }
    .col-lg-push-12 {
        left: 100%;
    }
    .col-lg-push-11 {
        left: 91.66666667%;
    }
    .col-lg-push-10 {
        left: 83.33333333%;
    }
    .col-lg-push-9 {
        left: 75%;
    }
    .col-lg-push-8 {
        left: 66.66666667%;
    }
    .col-lg-push-7 {
        left: 58.33333333%;
    }
    .col-lg-push-6 {
        left: 50%;
    }
    .col-lg-push-5 {
        left: 41.66666667%;
    }
    .col-lg-push-4 {
        left: 33.33333333%;
    }
    .col-lg-push-3 {
        left: 25%;
    }
    .col-lg-push-2 {
        left: 16.66666667%;
    }
    .col-lg-push-1 {
        left: 8.33333333%;
    }
    .col-lg-push-0 {
        left: auto;
    }
    .col-lg-offset-12 {
        margin-left: 100%;
    }
    .col-lg-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-lg-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-lg-offset-9 {
        margin-left: 75%;
    }
    .col-lg-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-lg-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-lg-offset-6 {
        margin-left: 50%;
    }
    .col-lg-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-lg-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-lg-offset-3 {
        margin-left: 25%;
    }
    .col-lg-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-lg-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-lg-offset-0 {
        margin-left: 0;
    }
}
/******************************************** h1~h6的样式 ****************************************************/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: inherit;  /* 设置某种字形 */
    font-weight: 500;  /* 设置字体加粗效果 */
    line-height: 1.1;  /* 设置行高，不带单位是倍数 */
    color: inherit;  /* 设置字体颜色，inherit为继承 */
}
.h1, h1 {
    font-size: 36px; /* 设置h1字体大小 */
}
.h2, h2 {
    font-size: 30px; /* 设置h2字体大小 */
    margin: 10px 0;
}
.h3, h3 {
    font-size: 24px; /* 设置h3字体大小 */
}
.h4, h4 {
    font-size: 18px; /* 设置h4字体大小 */
}
.h5, h5 {
    font-size: 14px; /* 设置h5字体大小 */
}
.h6, h6 {
    font-size: 12px; /* 设置h6字体大小 */
}
p {
    margin: 0 0 15px; /* 设置p外边距 */
}
h1 small, .h1 small,
h2 small, .h2 small,
h3 small, .h3 small,
h1 .small, .h1 .small,
h2 .small, .h2 .small,
h3 .small, .h3 .small {
     font-size: 65%;  /* 设置副标题大小为正标题的65% */
 }
.h1, .h2, .h3, h1, h2, h3 {
    margin-bottom: 10px;
}
h4 small, .h4 small,
h5 small, .h5 small,
h6 small, .h6 small,
h4 .small, .h4 .small,
h5 .small, .h5 .small,
h6 .small, .h6 .small {
    font-size: 75%;  /* 设置副标题大小为正标题的75% */
}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small,
.h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small,
h1 .small, h2 .small, h3 .small, h4 .small, h5 .small, h6 .small,
.h1 .small, .h2 .small, .h3 .small, .h4 .small, .h5 .small, .h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #777;
}
/******************************************** 语义化标签样式 ***********************************************/
/* ***************内联文本元素************************ */
mark {  /* 高亮显示,背景为黄色 */
    padding: .2em;
    color: #000;
    background: #ff0;
}
del, s {  /* 样式为被删除的文本 */
    text-decoration: line-through;
}
u, ins {  /* 样式为含下划线的文本 */
    text-decoration: underline;
}
small, .small {  /* 小字号文本 */
    font-size: 85%;
}

/*****************************************************/
i, cite, em, var, address, dfn {
    font-style: italic;  /* 斜体 */
}
/* ****************HTML5元素语义化******************* */
code, kbd, pre, samp {
    font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
}
code {  /* 突出显示code标签里的内容，背景色为danger */
    padding: 2px 4px;
    font-size: 90%;
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px;
}
kbd {  /* 类似键盘上的按键效果 */
    padding: 2px 4px;
    font-size: 90%;
    color: #fff;
    background-color: #333;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
}
pre {  /* 用于多行代码(文本)的显示效果 */
    display: block;
    padding: 9px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #333;
    word-break: break-all;  /* 允许在单词内换行 */
    word-wrap: break-word;  /* 在长单词或 URL 地址内部进行换行 */
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
}
pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0;
}
.highlight {
    background-color: #f7f7f9;
    border: 1px solid #e1e1e8;
    border-radius: 4px;
    margin-bottom: 14px;
    padding: 9px 14px;
}
.highlight pre {
    padding: 0;
    border: none;
    border-radius: 0;
    margin-bottom: 0;
}
.highlight pre code .cm {
    color: #999;
}
.highlight pre code .k {
    display: inline;
    color: #069;
}
.highlight pre code .mgb{
    margin-bottom: 20px;
}
.highlight pre code .mgb:last-child {
    margin-bottom: 0;
}
/* <div> 和 </div> 的代码颜色 */
.v{
    color: #2f6f9f;
}
/* class= 的代码颜色 */
.s{
    color: #4f9fcf;
}
/* class内容 的代码颜色 */
.c {
    color: #d44950;
}
.bs-example {
    position: relative;
    padding: 45px 15px 15px;
    border-color: #e5e5e5 #eee #eee;
    border-style: solid;
    border-width: 1px 0;
    -webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
    box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
}
.bs-example .form-group {
    margin-bottom: 0;
}
.bs-example > span:first-child {
    position: absolute;
    left: 15px;
    top: 15px;
}
.bs-example + .highlight pre {
    background-color: transparent;
}
@media (min-width: 768px) {
    .bs-example {
        margin-right: 0;
        margin-left: 0;
        background-color: #fff;
        border: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}
.bs-example > .table > tbody > tr:first-child > td {
    border-top: 0;
}
.bs-example .table th,
.bs-example .table td{
    padding: 15px 0;
    /*border-color: #eee;*/
}
.bs-example .text-explain {
    color: #767676;
    vertical-align: middle;
}
.bs-example+.highlight, .bs-example+.zero-clipboard+.highlight {
    border-width: 0 0 1px;
    border-radius: 0;
}
@media (min-width: 768px) {
    .bs-example + .highlight, .bs-example + .zero-clipboard + .highlight {
        border-width: 1px;
        border-top: 0;
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 4px;
    }
}

.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}

.bs-callout-primary {
    border-left-color: #1b809e;
}
.bs-callout-primary h1,
.bs-callout-primary h2,
.bs-callout-primary h3,
.bs-callout-primary h4,
.bs-callout-primary h5,
.bs-callout-primary h6 {
    color: #1b809e;
    margin-bottom: 10px;
}
.bs-callout-success {
    border-left-color: #468847;
}
.bs-callout-success h1,
.bs-callout-success h2,
.bs-callout-success h3,
.bs-callout-success h4,
.bs-callout-success h5,
.bs-callout-success h6 {
    color: #468847;
    margin-bottom: 10px;
}
.bs-callout-info {
    border-left-color: #5bc0de;
}
.bs-callout-info h1,
.bs-callout-info h2,
.bs-callout-info h3,
.bs-callout-info h4,
.bs-callout-info h5,
.bs-callout-info h6 {
    color: #5bc0de;
    margin-bottom: 10px;
}
.bs-callout-warning {
    border-left-color: #aa6708;
}
.bs-callout-warning h1,
.bs-callout-warning h2,
.bs-callout-warning h3,
.bs-callout-warning h4,
.bs-callout-warning h5,
.bs-callout-warning h6 {
    color: #aa6708;
    margin-bottom: 10px;
}
.bs-callout-danger {
    border-left-color: #d9534f;
}
.bs-callout-danger h1,
.bs-callout-danger h2,
.bs-callout-danger h3,
.bs-callout-danger h4,
.bs-callout-danger h5,
.bs-callout-danger h6 {
    color: #d9534f;
    margin-bottom: 10px;
}

/*******************************************************/
/******************************************** 文本排版样式 ***********************************************/
.text-left {
    text-align: left;  /* 文本左对齐 */
}
.text-right {
    text-align: right;  /* 文本右对齐 */
}
.text-center {
    text-align: center;  /* 文本居中对齐 */
}
.text-nowrap {
    white-space: nowrap;  /* 设置文本强制不换行 */
}
.text-lowercase {
    text-transform: lowercase;  /* 设置字母文本都转为小写 */
}
.text-uppercase {
    text-transform: uppercase;  /* 设置字母文本都转为大写 */
}
.text-capitalize {
    text-transform: capitalize;  /* 设置字母文本首字母大写 */
}
.text-muted {
    color: #777;  /* 设置文本的颜色为浅灰，表示强调 */
}
/* 链接文字字体颜色为text-primary样式 */
.text-primary {
    color: #337ab7;
}
a.text-primary:hover {
    color: #286090;
}
/************************************/
/* 链接文字字体颜色为text-success样式 */
.text-success {
    color: #3c763d;
}
a.text-success:hover {
    color: #2b542c;
}
/************************************/
/* 链接文字字体颜色为text-info样式 */
.text-info {
    color: #31708f;
}
a.text-info:hover {
    color: #245269;
}
/************************************/
/* 链接文字字体颜色为text-warning样式 */
.text-warning {
    color: #8a6d3b;
}
a.text-warning:hover {
    color: #66512c;
}
/************************************/
/* 链接文字字体颜色为text-danger样式 */
.text-danger {
    color: #a94442;
}
a.text-danger:hover {
    color: #843534;
}
/************************************/

/* 链接文字背景颜色为bg-primary样式 */
.bg-primary {
    color: #fff;
    background-color: #337ab7;
}
a.bg-primary:hover {
    background-color: #286090;
}
/*********************************/
/* 链接文字背景颜色为bg-success样式 */
.bg-success {
    background-color: #dff0d8;
}
a.bg-success:hover {
    background-color: #c1e2b3;
}
/*********************************/
/* 链接文字背景颜色为bg-info样式 */
.bg-info {
    background-color: #d9edf7;
}
a.bg-info:hover {
    background-color: #afd9ee;
}
/*******************************/
/* 链接文字背景颜色为bg-warning样式 */
.bg-warning {
    background-color: #fcf8e3;
}
a.bg-warning:hover {
    background-color: #f7ecb5;
}
/*********************************/
/* 链接文字背景颜色为bg-danger样式 */
.bg-danger {
    background-color: #f2dede;
}
a.bg-danger:hover {
    background-color: #e4b9b9;
}
/********************************/
/* *********文本圆角************ */
.text-radius{
    word-break:break-all;  /* 解决浏览器窗口缩小时文字溢出的问题 */
    border-radius: 3px;
}
/********************************/
.block-center {
    display: block;
    margin-right: auto;
    margin-left: auto;
}
/***************************************响应式显示隐藏样式****************************************************/
.visible-xs-block, .visible-xs-inline, .visible-xs-inline-block,
.visible-sm-block, .visible-sm-inline, .visible-sm-inline-block,
.visible-md-block, .visible-md-inline, .visible-md-inline-block,
.visible-lg-block, .visible-lg-inline, .visible-lg-inline-block {
    display: none !important;
}
@media (max-width: 768px) {
    .hidden-xs{
        display: none !important;
    }

    .visible-xs-block, .visible-xs{
        display: block !important;
    }
    .visible-xs-inline{
        display: inline !important;
    }
    .visible-xs-inline-block{
         display: inline-block !important;
    }
}
@media (min-width: 769px) and (max-width: 992px) {
    .hidden-sm{
        display: none !important;
    }
    .visible-sm-block, .visible-sm{
        display: block !important;
    }
    .visible-sm-inline{
        display: inline !important;
    }
    .visible-sm-inline-block{
        display: inline-block !important;
    }

    .visible-md-block{
        display: block !important;
    }
    .visible-md-inline{
        display: inline !important;
    }
    .visible-md-inline-block{
        display: inline-block !important;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    .hidden-md{
        display: none !important;
    }

    .visible-md-block, .visible-md{
        display: block !important;
    }
    .visible-md-inline{
        display: inline !important;
    }
    .visible-md-inline-block{
        display: inline-block !important;
    }
}
@media (min-width: 1200px) {
    .hidden-lg{
        display: none !important;
    }

    .visible-lg-block, .visible-lg{
        display: block !important;
    }
    .visible-lg-inline{
        display: inline !important;
    }
    .visible-lg-inline-block{
        display: inline-block !important;
    }
}
/*************************************** 绝对定位样式 ************************************************/
.fixed-top{
    position: fixed;
    top: 0;
    left: 0;
}
.fixed-bottom{
    position: fixed;
    bottom: 0;
    left: 0;
}
.fLeft{
    float: left;
}
.fRight{
    float: right;
}
/*.navbar-item > ul > li > .navbar-brand {*/
    /*float: left;*/
    /*height: 50px;*/
    /*padding: 15px 15px;*/
    /*margin-left: -15px;*/
    /*font-size: 18px;*/
    /*line-height: 20px;*/
/*}*/
/*.navbar-item > ul > li > .navbar-brand:hover,*/
/*.navbar-item > ul > li > .navbar-brand:focus {*/
    /*background-color: transparent;*/
/*}*/
/*.navbar-brand:hover,*/
/*.navbar-brand:focus {*/
    /*text-decoration: none;*/
/*}*/
/*.navbar a {*/
    /*color: #3c763d;*/
/*}*/
/*.navbar-item > ul > li > a{*/
    /*font-size: 14px;*/
    /*color: #3c763d;*/
    /*float: left;*/
    /*height: 50px;*/
    /*padding: 15px 15px;*/
    /*line-height: 20px;*/
/*}*/
/*.navbar-item > ul > li > a:hover,*/
/*.navbar-item > ul > li > a:focus,*/
/*.navbar-item > ul > li > a.active {*/
    /*background-color: #ddd;*/
    /*!*color: #fff;*!*/
/*}*/
/*.navbar-item > ul:first-child > li{*/
    /*float: left;*/
/*}*/
/*.navbar-item > ul:nth-child(2) > li{*/
    /*float: right;*/
/*}*/
/*.navbar-item > ul:before,*/
/*.navbar-item > ul:after {*/
    /*display: table;*/
    /*content: '';*/
/*}*/
/*.navbar-item > ul:after{*/
    /*clear: both;*/
/*}*/

/******************************************** 文本框样式 ****************************************************/
.form-group {
    margin-bottom: 15px;
}

.form-control {
    width: 100%; /* 设置宽度 */
    height: 34px; /* 必须得加，因为IE9+文本框的高度和其他浏览器不一样，无法调兼容 */
    padding: 6px; /* 设置内边距 */
    display: block; /* 转为块元素 */
    font-size: 14px; /* 设置字体大小 */
    color: #555; /* 设置字体颜色 */
    line-height: 1.45; /* 设置行高，不带单位是倍数 */
    /* line-height(即input里的内容高) = (1.2 * font-size);
       注：当line-height: 1;时，line-height(即input里的内容高) = (1.2 * font-size) + 2
    */
    border-radius: 4px; /* 设置盒子的圆角效果 */
    background-color: #fff; /* 设置背景颜色 */
    background-image: none; /* 设置背景图片 */
    border: 1px solid #ccc; /* 设置边框 */
    box-shadow: 0 0 5px rgba(255,255,255,0); /* 设置盒子的阴影效果 */
    transition: 0.3s; /* 设置样式改变的过渡效果 */
    margin-bottom: 15px;
}

.control-label {
    display: inline-block;
    font-weight: 700;
    margin-bottom: 5px;
}

@media (min-width: 768px) {
    .form-inline .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
    }
    .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle;
        margin-bottom: 0;
    }
    .form-inline .control-label {
        display: inline-block;
        font-weight: 700;
        margin-bottom: 0;
        vertical-align: middle;
    }
}

.form-control::selection {
    background-color: pink; /* 设置背景颜色 */
    color: #fff; /* 设置字体颜色 */
}

.form-control:focus {
    outline: none; /* 去掉文本框获取焦点时的焦点框 */
    border-color: #66afe9; /* 设置边框 */
    box-shadow: 0 0 5px rgba(102,175,233,1); /* 设置盒子的阴影效果 */
}

.checkbox, .radio {
    position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}
.checkbox label, .radio label {
    min-height: 20px;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
    vertical-align: bottom;
}
.checkbox label input, .radio label input {
    vertical-align: middle;
    position: relative;
}
.checkbox[disabled] label span, .radio[disabled] label span,
.checkbox.disabled label span, .radio.disabled label span{
    vertical-align: middle;
    position: relative;color: #8c8c8c;
    cursor: not-allowed !important;
}

.disabled, [disabled], .disabled > input, [disabled] > input,  fieldset[disabled] input[type=checkbox], fieldset[disabled] input[type=radio], input[type=checkbox].disabled, input[type=checkbox][disabled], input[type=radio].disabled, input[type=radio][disabled] {
    cursor: not-allowed !important;
}
/******************************************** 内联input组样式 ****************************************************/

.input-group-addon:first-child, .input-group-btn:first-child {
    border-right: 0;
}
.input-group-addon:last-child, .input-group-addon:last-child {
    border-left: 0;
}
.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group>.btn, .input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn-group:not(:last-child)>.btn, .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0;
}

.input-group {
    border-collapse: separate;
    display: table;
    position: relative;
}
.input-group-addon {
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #555;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    padding: 6px 12px;
    text-align: center;
}
.input-group-addon, .input-group-btn {
    vertical-align: middle;
    white-space: nowrap;
    width: 1%;
}
.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}
.input-group .form-control {
    position: relative;
    width: 100%;
    z-index: 2;
}

.input-group .form-control {
    margin-bottom: 0;
}
@media (min-width: 768px) {
    .form-inline .input-group .input-group-addon,
    .form-inline .input-group .input-group-btn,
    .form-inline .input-group .form-control {
    width: auto;
    }
}
/*********************************************水平表单*****************************************************/
@media (min-width: 768px) {
    .form-horizontal .control-label {
        height: 34px;
        line-height: 34px;
        margin-bottom: 0;
        text-align: right;
        vertical-align: middle;
    }
    .form-horizontal .form-control {
        vertical-align: middle;
    }
    .form-horizontal .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        padding: 0 15px;
    }
}

textarea.form-control {
    height: auto;
}
/*********************************************************************************************************/
/***********************************************导航*******************************************************/
.nav > li {
    position: relative;
    display: block;
}
.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: #337ab7;
}
/* 鼠标移上列表项时链接的背景颜色 */
.nav > li > a:hover,
.nav > li > a:focus {
    background-color: #eee;
}
/* 列表项设置禁用时链接的颜色 */
.nav > li.disabled > a {
    color: #777;
}
/* 列表项设置了禁用时，鼠标移上链接时链接的样式 */
.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
    color: #777;
    cursor: not-allowed;
    background-color: transparent;
}
/* 设置列表项之间的分割线 */
.nav .nav-divider {
    height: 1px;
    overflow: hidden;
    background-color: #e5e5e5;
}
.nav-tabs {
    border-bottom: 1px solid #ddd;
}
.nav-tabs > li {
    float: left;
    margin-bottom: -1px;
}
.nav-tabs > li > a {
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
}
.nav-tabs > li > a:hover {
    border-color: #eee #eee #ddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

.nav-tabs.nav-justified {
    width: 100%;
    border-bottom: 0;
}
.nav-tabs.nav-justified > li {
    float: none;
}
.nav-tabs.nav-justified > li > a {
    text-align: center;
}
@media (min-width: 768px) {
    .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%;
    }
    .nav-tabs.nav-justified > li > a {
        margin-bottom: 0;
    }
}
.nav-tabs.nav-justified > li > a {
    border-radius: 4px;
}
.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
    border: 1px solid #ddd;
}
@media (min-width: 768px) {
    .nav-tabs.nav-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
    }
    .nav-tabs.nav-justified > .active > a,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:focus {
        border-bottom-color: transparent;
    }
}
.nav-pills > li {
    float: left;
}
.nav-pills > li > a {
    border-radius: 4px;
}
/********************************************************************/
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #337ab7;
}
.nav-pills.nav-pills-success > li.active > a,
.nav-pills.nav-pills-success > li.active > a:hover,
.nav-pills.nav-pills-success > li.active > a:focus {
    color: #fff;
    background-color: #5cb85c;
}
.nav-pills.nav-pills-info > li.active > a,
.nav-pills.nav-pills-info > li.active > a:hover,
.nav-pills.nav-pills-info > li.active > a:focus {
    color: #fff;
    background-color: #5bc0de;
}
.nav-pills.nav-pills-warning > li.active > a,
.nav-pills.nav-pills-warning > li.active > a:hover,
.nav-pills.nav-pills-warning > li.active > a:focus {
    color: #fff;
    background-color: #eb9316;
}
.nav-pills.nav-pills-danger > li.active > a,
.nav-pills.nav-pills-danger > li.active > a:hover,
.nav-pills.nav-pills-danger > li.active > a:focus {
    color: #fff;
    background-color: #d9534f;
}
/*********************************************************************/
.nav-pills.nav-justified > li {
    float: none;
}
.nav-pills.nav-justified > li > a {
    text-align: center;
}
@media (min-width: 768px) {
    .nav-pills.nav-justified > li {
        display: table-cell;  /* 将li转化为类似表格td的一行结构 */
        width: 1%;  /* 将每个li的宽度平分父级的宽度 */
    }
}
.nav-pills.nav-justified > li > a {
    border-radius: 4px;
}

/******************************************** 表格样式 ****************************************************/
/* 初始化表格 */
.table {
    width: 100%;
    max-width: 100%;
}
/* 初始化表头th */
th{
    text-align: left;
}
/* 给表格每一行或者表格的每个单元格添加背景颜色 */
.table>tbody>tr.active, .table>tbody>tr>th.active, .table>tbody>tr>td.active{
     background-color: #f5f5f5;
 }
.table>tbody>tr.info, .table>tbody>tr>th.info, .table>tbody>tr>td.info{
    background-color: #d9edf7;
}
.table>tbody>tr.success, .table>tbody>tr>th.success, .table>tbody>tr>td.success{
    background-color: #dff0d8;
}
.table>tbody>tr.warning, .table>tbody>tr>th.warning, .table>tbody>tr>td.warning{
    background-color: #fcf8e3;
}
.table>tbody>tr.danger, .table>tbody>tr>th.danger, .table>tbody>tr>td.danger{
    background-color: #f2dede;
}
/*****************************************/
/* 给奇数行单元格设置颜色样式 */
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td{
    padding: 10px;
    border-top: 1px solid #ddd;
    line-height: 1.42857143;
    vertical-align: top;
}
/* 给奇数行单元格设置颜色样式 */
.table-striped>thead>tr:nth-child(odd),
.table-striped>tbody>tr:nth-child(odd),
.table-striped>tfoot>tr:nth-child(odd) {
    background-color: #f9f9f9;
}
/* 给偶数行单元格设置颜色样式 */
.table-striped>thead>tr:nth-child(even),
.table-striped>tbody>tr:nth-child(even),
.table-striped>tfoot>tr:nth-child(even) {
    /*background-color: #0f0;*/
}
/* 给表格设置边框 */
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
    border: 1px solid #ddd;
}
/* 表格每行的hover */
.table-hover > tbody > tr:hover {
    background-color: #f5f5f5;
}
/* 压缩单元格内边距 */
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
    padding: 8px !important;
}
.table > thead > tr.active > th,
.table > tbody > tr.active > th,
.table > tfoot > tr.active > th,
.table > thead > tr.active > td,
.table > tbody > tr.active > td,
.table > tfoot > tr.active > td {
    background-color: #f5f5f5;
}
.table > thead > tr.success > th,
.table > tbody > tr.success > th,
.table > tfoot > tr.success > th,
.table > thead > tr.success > td,
.table > tbody > tr.success > td,
.table > tfoot > tr.success > td {
    background-color: #dff0d8;
}
.table > thead > tr.info > th,
.table > tbody > tr.info > th,
.table > tfoot > tr.info > th,
.table > thead > tr.info > td,
.table > tbody > tr.info > td,
.table > tfoot > tr.info > td {
    background-color: #d9edf7;
}
.table > thead > tr.warning > th,
.table > tbody > tr.warning > th,
.table > tfoot > tr.warning > th,
.table > thead > tr.warning > td,
.table > tbody > tr.warning > td,
.table > tfoot > tr.warning > td {
    background-color: #fcf8e3;
}
.table > thead > tr.danger > th,
.table > tbody > tr.danger > th,
.table > tfoot > tr.danger > th,
.table > thead > tr.danger > td,
.table > tbody > tr.danger > td,
.table > tfoot > tr.danger > td {
    background-color: #f2dede;
}
/*.table-responsive*/
@media screen and (max-width: 767px) {
    .table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #ddd;
    }
    .table-responsive > .table {
        margin-bottom: 0;
    }
    .table-responsive > .table > thead > tr > th,
    .table-responsive > .table > tbody > tr > th,
    .table-responsive > .table > tfoot > tr > th,
    .table-responsive > .table > thead > tr > td,
    .table-responsive > .table > tbody > tr > td,
    .table-responsive > .table > tfoot > tr > td {
        white-space: nowrap;  /* 让每个单元格强制不换行 */
    }
    .table-responsive > .table-bordered {
        border: 0;  /* 重置边框 */
    }
    .table-responsive > .table-bordered > thead > tr > th:first-child,
    .table-responsive > .table-bordered > tbody > tr > th:first-child,
    .table-responsive > .table-bordered > tfoot > tr > th:first-child,
    .table-responsive > .table-bordered > thead > tr > td:first-child,
    .table-responsive > .table-bordered > tbody > tr > td:first-child,
    .table-responsive > .table-bordered > tfoot > tr > td:first-child {
        border-left: 0;
    }
    .table-responsive > .table-bordered > thead > tr > th:last-child,
    .table-responsive > .table-bordered > tbody > tr > th:last-child,
    .table-responsive > .table-bordered > tfoot > tr > th:last-child,
    .table-responsive > .table-bordered > thead > tr > td:last-child,
    .table-responsive > .table-bordered > tbody > tr > td:last-child,
    .table-responsive > .table-bordered > tfoot > tr > td:last-child {
        border-right: 0;
    }
    .table-responsive > .table-bordered > tbody > tr:last-child > th,
    .table-responsive > .table-bordered > tfoot > tr:last-child > th,
    .table-responsive > .table-bordered > tbody > tr:last-child > td,
    .table-responsive > .table-bordered > tfoot > tr:last-child > td {
        border-bottom: 0;
    }
}
/******************************************** 列表样式 ****************************************************/
.list-group{   /* 作用的元素可以是<ul>、<div>... */
    border-radius: 4px;
    margin-bottom: 20px;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
}
.list-group-item {   /* 作用的元素可以是<li>、<a>、<button>... */
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;  /* 折叠边框 */
    background-color: #fff;
    border: 1px solid #ddd;
}
.list-group-item:hover {
    cursor: pointer;
}
/* 设置第一个列表项的圆角 */
.list-group-item:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
/* ******************* */

/* 设置第一个列表项的圆角 */
.list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}
/* ******************* */

/* 设置列表项禁用 */
.list-group-item.disabled,
.list-group-item.disabled:hover,
.list-group-item.disabled:focus {
    color: #777;
    cursor: not-allowed;  /* 鼠标禁用图标 */
    background-color: #eee;
}
.list-group-item, .list-group-item>p, .list-group-item .list-group-item-text{
    word-break:break-all;  /* 解决浏览器窗口缩小时文字溢出的问题 */
}
/* *************************************************************** */
.list-group-item {
    color: #555;
}
.list-group-item .list-group-item-heading {
    color: #333;
}
.list-group-item .list-group-item-text {
    color: #555;
}
a.list-group-item:hover,
a.list-group-item:focus {
    color: #555;
    background-color: #f5f5f5;
}
/* *************************************************************** */

/* 设置禁用disable下的list-group-item-heading和list-group-item-text */
.list-group-item.disabled .list-group-item-heading,
.list-group-item.disabled:hover .list-group-item-heading,
.list-group-item.disabled:focus .list-group-item-heading {
    color: inherit;
}
.list-group-item.disabled .list-group-item-text,
.list-group-item.disabled:hover .list-group-item-text,
.list-group-item.disabled:focus .list-group-item-text {
    color: #777;
}
/* *************************************************************** */

/* 列表项list-group-item使用active时相应的样式 */
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    z-index: 2;
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}
.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,   /* 副标题 */
.list-group-item.active:focus .list-group-item-heading,
.list-group-item.active .list-group-item-heading > small, /* 副标题 */
.list-group-item.active:hover .list-group-item-heading > small,
.list-group-item.active:focus .list-group-item-heading > small,
.list-group-item.active .list-group-item-heading > .small,
.list-group-item.active:hover .list-group-item-heading > .small,
.list-group-item.active:focus .list-group-item-heading > .small {
    color: inherit;  /* 继承.list-group-item.active的颜色样式 */
}
.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
    word-break:break-all;  /* 解决浏览器窗口缩小时文字溢出的问题 */
    color: #c7ddef;
}
/* *************************************************************** */

/* 列表项的list-group-item-success相应的样式 */
.list-group-item-success {
    color: #3c763d;
    background-color: #dff0d8;
}
.list-group-item-success .list-group-item-heading,
.list-group-item-success .list-group-item-text{
    color: inherit;
}
a.list-group-item-success:hover,
a.list-group-item-success:focus {
    color: #3c763d;
    background-color: #d0e9c6;
}
a.list-group-item-success.active,
a.list-group-item-success.active:hover,
a.list-group-item-success.active:focus {
    color: #fff;
    background-color: #3c763d;
    border-color: #3c763d;
}
/* **************************************** */

/* 列表项的list-group-item-info相应的样式 */
.list-group-item-info {
    color: #31708f;
    background-color: #d9edf7;
}
.list-group-item-info .list-group-item-heading,
.list-group-item-info .list-group-item-text{
    color: inherit;
}
a.list-group-item-info:hover,
a.list-group-item-info:focus {
    color: #31708f;
    background-color: #c4e3f3;
}
a.list-group-item-info.active,
a.list-group-item-info.active:hover,
a.list-group-item-info.active:focus {
    color: #fff;
    background-color: #31708f;
    border-color: #31708f;
}
/* ************************************ */

/* 列表项的list-group-item-warning相应的样式 */
.list-group-item-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
}
.list-group-item-warning .list-group-item-heading,
.list-group-item-warning .list-group-item-text{
    color: inherit;
}
a.list-group-item-warning:hover,
a.list-group-item-warning:focus {
    color: #8a6d3b;
    background-color: #faf2cc;
}
a.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus {
    color: #fff;
    background-color: #8a6d3b;
    border-color: #8a6d3b;
}
/* **************************************** */

/* 列表项的list-group-item-warning相应的样式 */
.list-group-item-danger {
    color: #a94442;
    background-color: #f2dede;
}
.list-group-item-danger .list-group-item-heading,
.list-group-item-danger .list-group-item-text{
    color: inherit;
}
a.list-group-item-danger:hover,
a.list-group-item-danger:focus {
    color: #a94442;
    background-color: #ebcccc;
}
a.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus {
    color: #fff;
    background-color: #a94442;
    border-color: #a94442;
}
.list-group-item-heading {
    margin-top: 0;  /* 去除p默认设置上外边距 */
    margin-bottom: 5px;
}
.list-group-item-text {
    margin-bottom: 0; /* 去除p默认设置下外边距 */
    line-height: 1.3;
}
/* **************************************** */
/******************************************** 按钮样式 ****************************************************/
.btn:active,
.btn.active,
.btn-default:active,
.btn-primary:active,
.btn-success:active,
.btn-info:active,
.btn-warning:active,
.btn-danger:active,
.btn-default.active,
.btn-primary.active,
.btn-success.active,
.btn-info.active,
.btn-warning.active,
.btn-danger.active {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    +border: none;
    border-radius: 4px;
    outline: 0;
    overflow: visible;
    width: auto;
}

.btn-lg, .btn-group-lg > .btn {
    padding: 30px 20px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
}
.btn-sm, .btn-group-sm > .btn {
     padding: 5px 10px;
     font-size: 12px;
     line-height: 1.5;
     border-radius: 3px;
}

.input-group-lg>.form-control, .input-group-lg>.input-group-addon, .input-group-lg>.input-group-btn>.btn {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
}
.input-group-sm>.form-control, .input-group-sm>.input-group-addon, .input-group-sm>.input-group-btn>.btn {
    height: 30px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.3333333;
}

.btn-block {
    display: block;
    width: 100%;
}

.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
    cursor: not-allowed;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: .65;
}

button::-moz-focus-inner{ /* 解决火狐浏览器下button高度比谷歌浏览器高2px */
    border: 0;
    padding: 0;
}

.btn:active,
.btn.active {
    background-image: none;
}

.btn-default {
    +padding: 5 px 12 px;
    border: 1px solid #dbdbdb;
    background-color: #fff;
    color: #333;
}

.btn-default:hover,
.btn-default:focus {
    background-color: #e0e0e0;
    background-position: 0 -15px;
}

.btn-default:active,
.btn-default.active {
    background-color: #e0e0e0;
}

.btn-default.disabled,
.btn-default:disabled,
.btn-default[disabled] {
    background-color: #e0e0e0;
    background-image: none;
}

.btn-primary {
    background-color: #337ab7;
    /*border-color: #245580;*/
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #265a88;
    background-position: 0 -15px;
}

.btn-primary:active,
.btn-primary.active {
    background-color: #265a88;
    border-color: #245580;
}

.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary[disabled] {
    background-color: #265a88;
    background-image: none;
}

.btn-success {
    color: #fff;
    background-color: #5cb85c;
    /*border-color: #3e8f3e;*/
}

.btn-success:hover,
.btn-success:focus {
    background-color: #419641;
    background-position: 0 -15px;
}

.btn-success:active,
.btn-success.active {
    background-color: #419641;
    border-color: #3e8f3e;
}

.btn-success.disabled,
.btn-success:disabled,
.btn-success[disabled] {
    background-color: #419641;
    background-image: none;
}

.btn-info {
    color: #fff;
    background-color: #5bc0de;
    /*border-color: #28a4c9;*/
}

.btn-info:hover,
.btn-info:focus {
    background-color: #2aabd2;
    background-position: 0 -15px;
}

.btn-info:active,
.btn-info.active {
    background-color: #2aabd2;
    border-color: #28a4c9;
}

.btn-info.disabled,
.btn-info:disabled,
.btn-info[disabled] {
    background-color: #2aabd2;
    background-image: none;
}

.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    /*border-color: #e38d13;*/
}

.btn-warning:hover,
.btn-warning:focus {
    background-color: #eb9316;
    background-position: 0 -15px;
}

.btn-warning:active,
.btn-warning.active {
    background-color: #eb9316;
    border-color: #e38d13;
}

.btn-warning.disabled,
.btn-warning:disabled,
.btn-warning[disabled] {
    background-color: #eb9316;
    background-image: none;
}

.btn-danger {
    color: #fff;
    background-color: #d9534f;
    /*border-color: #b92c28;*/
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: #c12e2a;
    background-position: 0 -15px;
}

.btn-danger:active,
.btn-danger.active {
    background-color: #c12e2a;
    border-color: #b92c28;
}

.btn-danger.disabled,
.btn-danger:disabled,
.btn-danger[disabled] {
    background-color: #c12e2a;
    background-image: none;
}

/******************************************** 水平按钮组样式 ****************************************************/
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { /* 除第一个和最后一个以外的所有.btn */
    border-radius: 0;
}

.btn-group > .btn {
    float: left;
}

.btn-group > .btn-default:not(:first-child) {
    border-left: 0;
}
.btn-group-vertical > .btn-default:not(:first-child) {
    border-top: 0;
}

.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group > .btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/******************************************** 垂直按钮组样式 ****************************************************/
.btn-group, .btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: top; /* 按钮组对齐方式 */
}

.btn-group-vertical > .btn, .btn-group-vertical > .btn-group, .btn-group-vertical > .btn-group > .btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
    position: relative;
}

.btn-group-vertical > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { /* 除第一个和最后一个以外的所有.btn */
    border-radius: 0;
}

.btn-group-vertical > .btn:first-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group-vertical > .btn:last-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/******************************************** 按钮工具栏样式 ****************************************************/
.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group,
.btn-toolbar > .btn-group-vertical {
    margin-right: 5px;
    display: inline; /* 解决IE下的双边距BUG */
}

.btn-toolbar > .btn:last-child,
.btn-toolbar > .btn-group:last-child,
.btn-toolbar > .input-group:last-child,
.btn-toolbar > .btn-group-vertical:last-child {
    margin-right: 0;   /* btn-toolbar下最后一个按钮组 */
}

.btn-toolbar .btn-group, .btn-toolbar .input-group, .btn-toolbar .btn-group-vertical {
    float: left;
}
/**************图片样式*****************/
.img-responsive,
.thumbnail > img,  /* .thumbnail为缩略图样式，本质和.img-responsive差不多 */
.thumbnail a > img {
    display: block;
    max-width: 100%;
    height: auto;
}
.img-rounded {
    border-radius: 6px;
}
.img-thumbnail {
    display: inline-block;
    max-width: 100%;
    height: auto;
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.img-circle {
    border-radius: 50%;
}
hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee;
}
/**************************************/
/******************************************** 进度条样式 ****************************************************/
.progress{   /* 进度条父级样式 */
    min-height: 30px;  /* 行高 */
    border-radius: 4px;  /* 圆角 */
    background-color: #f5f5f5;  /* 背景颜色 */
    position: relative;
    overflow: hidden;  /* 子级溢出隐藏(清除浮动) */
    color: #fff;
}
.progress-bar-success,.progress-bar-info,.progress-bar-warning,.progress-bar-danger{  /* 公共样式 */
    width: 0;  /* 初始化宽度 */
}
.progress-bar{
    min-height: 30px;
    float: left;  /* 左浮动(父级得请浮动) */
    background-color: #337ab7;  /* 默认进度条颜色 */
    text-align: center;  /* 默认进度条文本对齐方式 */
    line-height: 30px;   /* 默认进度条行高 */
}
.progress-bar-success{  /* 可选进度条颜色1： success*/
    background-color: #5cb85c;
}
.progress-bar-info{   /* 可选进度条颜色1： info*/
    background-color: #5bc0de;
}
.progress-bar-warning{  /* 可选进度条颜色1： warning*/
    background-color: #f0ad4e;
}
.progress-bar-danger{  /* 可选进度条颜色1： danger*/
    background-color: #d9534f;
}
.progress-bar-striped {  /* 可选进度条斑马线效果,IE9以下不支持该属性*/
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    -webkit-background-size: 40px 40px;  /* 设置背景大小(兼容webkit内核的浏览器) */
    background-size: 40px 40px;   /* 设置背景大小,IE9以下不支持该属性 */
}
.progress.active .progress-bar,  /* 给进度条的父级添加active可同时作用所有的子级进度条 */
.progress-bar.active {  /* .progress-bar.active表示添加类.active时必须得有类.progress-bar该样式才有效果 */
    -webkit-animation: progress-bar-stripes 2s linear infinite;  /* -webkit-为兼容safari浏览器 */
    animation: progress-bar-stripes 2s linear infinite;  /* 标准animation写法 */
}
@keyframes progress-bar-stripes {  /* progress-bar-stripes为上面animation的第一个参数 */
    0% {    /* 没执行动画时的样式 */
        background-position: 40px 0;
    }
    100% {   /* 动画执行到100%时的样式 */
        background-position: 0 0;
    }
}
@-webkit-keyframes progress-bar-stripes {  /* -webkit-为兼容safari浏览器 */
    0% {   /* 没执行动画时的样式 */
        background-position: 40px 0;
    }
    100% {  /* 动画执行到100%时的样式 */
        background-position: 0 0;
    }
}
/* ********************************组件********************************************* */
/************微章***************/
.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    margin-top: -2px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777;
    border-radius: 10px;
}
.btn .badge {
    position: relative;
    top: -1px;
}
.btn-default .badge {
    color: #fff;
    background-color: #777;
}
.btn-primary .badge {
    color: #337ab7;
    background-color: #fff;
}
.btn-success .badge {
    color: #5cb85c;
    background-color: #fff;
}
.btn-info .badge {
    color: #5bc0de;
    background-color: #fff;
}
.btn-danger .badge {
    color: #d9534f;
    background-color: #fff;
}
/*********************************/
/*****************巨幕******************/
.jumbotron {
    padding: 30px 15px;
    margin-bottom: 30px;
    color: inherit;
    background-color: #eee;
    text-align: center;
}
.jumbotron h1,
.jumbotron .h1 {
    color: inherit;
}
.jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
    font-weight: 200;
    color: inherit;
}
.jumbotron > hr {
    border-top-color: #d5d5d5;
}
.container .jumbotron,
.container-fluid .jumbotron {
    border-radius: 6px;
}
.jumbotron .container {
    max-width: 100%;
}
@media screen and (min-width: 768px) {
    .jumbotron {
        padding: 48px 0;
        text-align: left;
    }
    .container .jumbotron,
    .container-fluid .jumbotron {
        padding-right: 60px;
        padding-left: 60px;
    }
    .jumbotron h1,
    .jumbotron .h1 {
        font-size: 63px;
    }
}

@media (min-width: 992px) {
    .bs-docs-header h1, .bs-docs-header p {
        margin-right: 380px;
    }
}
@media (min-width: 768px) {
    .bs-docs-header h1 {
        font-size: 60px;
        line-height: 1;
    }
}
.masthead:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url("../img/masthead-bg.png");
    opacity: .6;
}
.masthead .container {
    position: relative;
    z-index: 10;
}
.masthead {
    padding: 60px 0 80px;
    margin-bottom: 0;
    color: #fff;

    background: linear-gradient(45deg, #173125 0, #226d45 100%);
    /*background: linear-gradient(45deg, #312c0e 0, #406d41 100%);*/
    /*background: -webkit-gradient(linear,left bottom,right top,color-stop(0%,#020031),color-stop(100%,#6d3353));*/
}

@media screen and (min-width: 768px) {
    .masthead {
        padding: 90px 0 110px;
    }
}

.masthead h1 {
    margin-right: 0;
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 60px;
    line-height: 1;
    letter-spacing: -2px;
    font-weight: 700;
}
@media screen and (min-width: 768px) {
    .masthead h1 {
        font-size: 90px;
    }
}
@media screen and (min-width: 992px) {
    .masthead h1 {
        font-size: 100px;
        line-height: 1.3;
    }
}
.masthead h2 {
    margin-right: 0;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 200;
    line-height: 1.25;
}
@media screen and (min-width: 768px) {
    .masthead h2 {
        font-size: 24px;
    }
}

@media screen and (min-width: 992px) {
    .masthead h2 {
        font-size: 30px;
    }
}
.masthead p {
    margin-right: 0;
    margin-top: 30px;
    margin-bottom: 10px;
}

.masthead ul li a {
    color: #d0d6d6;
}
.masthead ul li a:hover {
    color: #fff;
    text-decoration: underline !important;
}

/************************************/
/**************警告框******************/
.alert {
    position: relative;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 8px;
}
.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}
.alert-success hr {
    border-top-color: #c9e2b3;
}
.alert-success .alert-link {
    color: #2b542c;
}
.alert-success .alert-link:hover,
.alert-info .alert-link:hover,
.alert-warning .alert-link:hover,
.alert-danger .alert-link:hover {
    text-decoration: underline;
}
.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}
.alert-info hr {
    border-top-color: #a6e1ec;
}
.alert-info .alert-link {
    color: #245269;
}
.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.alert-warning hr {
    border-top-color: #f7e1b5;
}
.alert-warning .alert-link {
    color: #66512c;
}
.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
.alert-danger hr {
    border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
    color: #843534;
}
.alert-dismissible .close {
    font-size: 27px;
    position: absolute;
    top: 1px;
    right: 10px;
    color: inherit;
    cursor: pointer;
}
/************************************/
/***************面板*****************/
.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}
.panel > .panel-heading {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}
/* 面板下的table只含有横向的border时设置的样式 */
.panel > .table-responsive > .table > thead > tr:first-child > th ,
.panel > .table-responsive > .table > tbody > tr:first-child > th {
    border-top: 0;
}
/**************折叠面板******************/
[data-panel="Collapse"] > .panel {
    box-shadow: none;
}
[data-panel="Collapse"] > .panel > .panel-heading {
    cursor: pointer;
}
[data-panel="Collapse"] > .panel > .list-group,
[data-panel="Collapse"] > .panel > .table-responsive,
[data-panel="Collapse"] > .panel > .table
{
    display: none;
}
[data-panel="Collapse"] > .panel:not(:last-child) {  /* ie8不支持:last-child选择器 */
    border-bottom: none;
}
/*[data-panel="Collapse"] > .panel:last-child > .panel-heading {*/
    /*border-bottom-left-radius: 8px;*/
    /*border-bottom-right-radius: 8px;*/
/*}*/
[data-panel="Collapse"] > .panel:not(:first-child),
[data-panel="Collapse"] > .panel:not(:first-child) > .panel-heading {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
[data-panel="Collapse"] > .panel:not(:last-child),  /* ie8不支持:last-child选择器 */
[data-panel="Collapse"] > .panel:not(:last-child) > .panel-footer {
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
[data-panel="Collapse"] > .panel:last-child > .list-group:last-child > .list-group-item:last-child {
    /*border-bottom: 1px solid ;*/
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

/*******************************************/

/* 面板下的table既含有横向的border，又含有纵向的border时设置的样式 */

/* 第一行的每个th的上边框设为0 */
.panel > .table-responsive > .table.table-bordered > thead > tr:first-child > th ,
.panel > .table-responsive > .table.table-bordered > tbody > tr:first-child > th {
    border-top: 0;
}
/****************************/

/* 最后一行的每个td的下边框设为0 */
.panel > .table-responsive > .table.table-bordered > thead > tr:last-child > td ,
.panel > .table-responsive > .table.table-bordered > tbody > tr:last-child > td {
    border-bottom: 0;
}
/******************************/

/* 每一行的第一个th或者td的左边框设为0 */
.panel > .table-responsive > .table.table-bordered > thead > tr > th:first-child ,
.panel > .table-responsive > .table.table-bordered > tbody > tr > th:first-child ,
.panel > .table-responsive > .table.table-bordered > thead > tr > td:first-child ,
.panel > .table-responsive > .table.table-bordered > tbody > tr > td:first-child {
    border-left: 0;
}
/* 每一行的第一个th或者td的右边框设为0 */
.panel > .table-responsive > .table.table-bordered > thead > tr > th:last-child ,
.panel > .table-responsive > .table.table-bordered > tbody > tr > th:last-child ,
.panel > .table-responsive > .table.table-bordered > thead > tr > td:last-child ,
.panel > .table-responsive > .table.table-bordered > tbody > tr > td:last-child {
    border-right: 0;
}
/**************************************************************/
.panel > .list-group{
    border-radius: 0;
    margin-bottom: 0;
}
.panel > .list-group > .list-group-item{
    border-left: 0;
    border-right: 0;
}
.panel > .list-group > .list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: 0;
}
.panel > .list-group > .list-group-item:last-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 0;
}
.panel > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #ddd;
}
.panel > .panel-heading .badge {
    color: #f5f5f5;
    background-color: #333;
}
.panel > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #ddd;
}
.panel-heading{
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
.panel-body{
    padding: 15px;
}
/* 面板的primary样式 */
.panel-primary {
    border-color: #337ab7;
}
.panel-primary > .panel-heading, .panel-primary > .panel-footer {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #337ab7;
}
.panel-primary > .panel-heading .badge {
    color: #337ab7;
    background-color: #fff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #337ab7;
}
/*********************/

/* 面板的success样式 */
.panel-success {
    border-color: #d6e9c6;
}
.panel-success > .panel-heading, .panel-success > .panel-footer {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}
.panel-success > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #d6e9c6;
}
.panel-success > .panel-heading .badge {
    color: #dff0d8;
    background-color: #3c763d;
}
.panel-success > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #d6e9c6;
}
/*********************/

/* 面板的info样式 */
.panel-info {
    border-color: #bce8f1;
}
.panel-info > .panel-heading, .panel-info > .panel-footer {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}
.panel-info > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #bce8f1;
}
.panel-info > .panel-heading .badge {
    color: #d9edf7;
    background-color: #31708f;
}
.panel-info > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #bce8f1;
}
/*******************/

/* 面板的warning样式 */
.panel-warning {
    border-color: #faebcc;
}
.panel-warning > .panel-heading, .panel-warning > .panel-footer {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.panel-warning > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #faebcc;
}
.panel-warning > .panel-heading .badge {
    color: #fcf8e3;
    background-color: #8a6d3b;
}
.panel-warning > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #faebcc;
}
/*******************/

/* 面板的warning样式 */
.panel-danger {
    border-color: #ebccd1;
}
.panel-danger > .panel-heading, .panel-danger > .panel-footer {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #ebccd1;
}
.panel-danger > .panel-heading .badge {
    color: #f2dede;
    background-color: #a94442;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #ebccd1;
}
/*******************/
/*************滚动监听****************/
.scroll-item div:before, .scroll-item div:after{
    display: table;
    content: " ";
}
.nav > li > a:hover,
.nav > li > a:focus {
    color: #6e6568;
    background-color: transparent;
}
/************************************/
/***************选项卡****************/
.tabs .tabs-content div{
    height: 100px;
    border: 1px solid #ddd;
    border-top: none;
}
.nav-tabs > li > a:hover {
    border-color: transparent transparent #ddd;
}

/* *************状态框************* */
.modal-hide {
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    display: none;
    opacity: 0;
}
.static-modal-content {
    min-height: 100px;
    background-color: #fff;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #999;
}
.modal-content {
    width: 600px;
    min-height: 100px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #999;
    overflow: hidden;
    position: fixed;
    left: 0;
    top: -600px;
    z-index: 101;
    display: none;
    opacity: 0;
}
@media (min-width: 768px) {
    .modal-content, .static-modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
        border: 1px solid rgba(0,0,0,.2);
    }
}
.modal-content-heading {
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
}
.modal-content-body {
    padding: 10px 15px;
}
.modal-content-body p:last-child {
    margin-bottom: 0;
}
.modal-content-footer {
    padding: 10px 15px;
    border-top: 1px solid #ddd;
}

/*******************************************/
.bs-docs-footer {
    text-align: center;
    padding: 50px 0;
    margin-top: 100px;
    background-color: #2a2730;
}
.bs-docs-footer-links {
    margin-bottom: 15px;
}
.bs-docs-footer-links:before,
.bs-docs-footer-links:after {
    display: block;
    content: '';
}
.bs-docs-footer-links:after {
    clear: both;
}
.bs-docs-footer-links li {
    display: inline-block;
}
.bs-docs-footer-links li:not(:first-child) {
    margin-left: 15px;
}
.bs-docs-footer a {
    color: #fff;
}
.bs-docs-footer a:hover {
    text-decoration: underline;
}
.bs-docs-footer p {
    color: #95908e;
    margin-bottom: 5px;
}
@media (min-width: 768px) {
    .bs-docs-footer {
        text-align: left;
    }
    .bs-docs-footer-links li {
        display: block;
        float: left;
    }
}

/**********************导航条**********************/
.navbar-inverse {
    background-color: #222;
    border-color: #080808;
}

.navbar-inverse .navbar-toggle {
    border-color: #333;
}
.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.navbar-inverse .navbar-brand {
    color: #9d9d9d;
}
.navbar-brand {
    float: left;
    height: 50px;
    padding: 15px 15px 15px 0;
    font-size: 18px;
    line-height: 20px;
}
.navbar-inverse .navbar-toggle .icon-bar {
    background-color: #fff;
}
.navbar-inverse .navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
}
.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 4px;
}
.navbar-nav {
    margin: 0 -15px;
}
.nav>li {
    position: relative;
    display: block;
}
.navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
}
.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}
.navbar-inverse .navbar-nav>li>a {
    color: #9d9d9d;
}
.navbar-inverse .navbar-nav>li>a:hover,
.navbar-header a:hover{
    color: #fff;
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus,
.navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: #080808;
}
.navbar-collapse {
    height: 0;
    overflow: hidden;
}
@media (min-width: 768px) {
    .navbar {
        border-radius: 4px;
    }
    .navbar-header {
        float: left;
    }
    .navbar-header .navbar-toggle {
        display: none;
    }
    .navbar-nav {
        float: left;
        margin: 0;
    }
    .navbar-collapse {
        height: 50px !important;
    }
    .navbar-nav-right {
        float: right;
    }
    .navbar-nav>li {
        float: left;
    }
    .navbar-nav>li>a {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}